<template>
  <div class="c-w100 c-contexty-hidden c-contextX-scroll c-ws-n c-flex-row c-aligni-center" :class="len>2?'':'c-justify-sa'">
    <div class="c-inlineblack" v-if="mainReward.integral && mainReward.sendIntegralStatus" :class="len>2?'c-mr24':''">
      <div class="c-ww170 c-hh170 gift-item c-pt20 c-pb16 c-flex-column c-justify-sb c-aligni-center">
        <img src="../../../assets/i/wap/recommend/point.png" class="c-ww64 c-hh80" />
        <span class="c-fc-white c-fs24">{{'奖励'+ mainReward.integral+customPointName}}</span>
      </div>
    </div>
    <template v-if="mainReward.equityList && mainReward.equityList.memberEquityList && mainReward.sendEquityStatus">
      <div class="c-inlineblack" v-for="(item,index) in mainReward.equityList.memberEquityList" :key="index" :class="len>2?'c-mr24':''">
        <div class="c-ww170 c-hh170 gift-item c-pt20 c-pb16 c-flex-column c-justify-sb c-aligni-center">
          <img v-if="item.type==5" src="../../../assets/i/wap/recommend/iconVIP.png" class="c-ww90 c-hh70" />
          <img v-else src="../../../assets/i/wap/recommend/iconSVIP.png" class="c-ww90 c-hh70" />
          <span class="c-fc-white c-fs24">{{(item.type==5?'VIP':'SVIP')+item.effectiveTime+'天体验卡'}}</span>
        </div>
      </div>
    </template>
    <div class="c-inlineblack" v-if="mainReward.equityList && mainReward.equityList.familyCard && mainReward.sendEquityStatus" :class="len>2?'c-mr24':''">
      <div class="c-ww170 c-hh170 gift-item c-pt20 c-pb16 c-flex-column c-justify-sb c-aligni-center">
        <img src="../../../assets/i/wap/recommend/iconFamilyCard.png" class="c-ww90 c-hh70" />
        <span class="c-fc-white c-fs24">亲情卡</span>
      </div>
    </div>
    <div class="c-inlineblack" v-if="mainReward.discountList && mainReward.discountList.length>0 && mainReward.sendDiscountStatus" :class="len>2?'c-mr24':''">
      <div class="c-ww170 c-hh170 gift-item c-pt20 c-pb16 c-flex-column c-justify-sb c-aligni-center">
        <img src="../../../assets/i/wap/recommend/iconCoupon.png" class="c-ww90 c-hh80" />
        <span class="c-fc-white c-fs24">优惠券礼包</span>
      </div>
    </div>
  </div>
</template>

<script>
    export default {
      name: "awardItem",
      props: {
        mainReward: {
          type: Object,
          default: function () {
            return {}
          }
        },
        len: {
          type: Number,
          default: 0
        }
      },
      data() {
        return {
          customPointName: localStorage.getItem("customPointName"),
        }
      }
    }
</script>

<style scoped>
.gift-item {
  background: url("../../../assets/i/wap/recommend/gift-item-bg.png");
  background-size: cover;
}
</style>
